<template>
	<view class="poRel">
		<navbar background="background-image: linear-gradient(to right, #2c6739, #99c043);"
			title="活动中心" @topTotalHeight="topTotalHeight"
		></navbar>
		<scroll-view scroll-x="true" class="whSpaNow backColWhite lh88r f28r borB1SE6e6e6 teAliCenter">
			<view @click="cliActivityBtn(index)" v-for="(item, index) in activityAry" :key="index"
				:class="['disInBlo', 'poRel', 'wPer50',
					activityIdx == index ? 'foWeiBold col99c043' : ''
				]"
			>
				{{item}}
				<text class="w50r h4r backCol99c043 poAbs bom0 left50P trTrXn50P"
					v-show="activityIdx == index"
				></text>
			</view>
		</scroll-view>
		<swiper @change="swiperChaFun" :current="activityIdx"
			:style="'height: ' + 'calc(100vh - ' + calcNum + 'px);'"
		>
			<swiper-item class="overYS">
				<scroll-view scroll-y="true" class="hPer100 poRel" @scrolltolower="orderScroll"
					:refresher-enabled="true" @refresherrefresh="orderRefresh" :refresher-triggered="ordertri0"
				>
					<movementList :detailedList="detailedList0" :noMore="noMore0"
						@refreshList="refreshList"
					></movementList>
				</scroll-view>
			</swiper-item>
			<swiper-item class="overYS">
				<scroll-view scroll-y="true" class="hPer100 poRel" @scrolltolower="orderScroll"
					:refresher-enabled="true" @refresherrefresh="orderRefresh" :refresher-triggered="ordertri1"
				>
					<movementList :detailedList="detailedList1" :noMore="noMore1"
						@refreshList="refreshList"
					></movementList>
				</scroll-view>
			</swiper-item>
		</swiper>
		<view class="poAbs wPer100 left0 zIndex1 backColrgba255a255a255a0s9"
			v-if="!token"
			:style="'height: ' + 'calc(100vh - ' + (calcNum - 45) + 'px);top: ' + (calcNum - 45) + 'px;'"
		>
			<navigator class="w300r teAliCenter f28r backImgLiGrTR2c6739a99c043 lh80r colFff borRad40r poAbs top50P left50P trTrn50Pn50P"
				url="/pages/personalCenter/login?type=2"
			>
				立即登录
			</navigator>
		</view>
	</view>
</template>
<script>
import navbar from '@/components/navbar.vue'
import { getMemberCardTasks } from '@/utils/api.js'
import movementList from '@/components/movementList.vue'
export default {
	components: { navbar, movementList },
	data() {
		return {
			calcNum: 0,
			token: '',
			activityAry: ['进行中', '已结束'], activityIdx: 0,
			ordertri0: false, detailedList0: [], noMore0: false, page0: 0,
			ordertri1: false, detailedList1: [], noMore1: false, page1: 0,
		}
	},
	onLoad() {
		
	},
	onShow() {
		// #ifdef MP-WEIXIN
			const token = uni.getStorageSync('token');
		// #endif
		// #ifdef H5
			const token = '2eae0f660b498bdc724dee1efa63407e';
			uni.setStorage({
				key: 'token', data: token
			})
		// #endif
		if(token) {
			this.token = token;
			this.getDataList0(0, 1);
			this.getDataList0(0, 2);
		}else {
			this.token = '';
		}
	},
	onShareAppMessage(res) {
		if (res.from === 'button') {
		    console.log(res.target)
		}
		return {
		    title: '山雀壹®共享茶室',
			imageUrl: '/static/images/logo.png',
		    path: '/pages/activityHome/index',
		    mpId: 'wxf8003ea15566ecd1'
		}
	},
	onShareTimeline(res) {
	    return {
	        title: '山雀壹®共享茶室',
	        type: 0,
	        summary: "",
	    }
	},
	methods: {
		topTotalHeight(height) {
			// #ifdef MP-WEIXIN
				this.calcNum = height + 45;
			// #endif
			// #ifdef H5
				this.calcNum = 45 + 50;
			// #endif
		},
		getDataList0(page, status, callBack) {
			uni.showLoading({ title: '加载中...' })
			getMemberCardTasks({
				token: this.token, number: 10, page, status
			}).then(res => {
				if(status == 1) {
					if(res.data.data && res.data.data.length) {
						res.data.data.forEach(item => {
							let startTxt = item.start_date.replace(/T/g,' ').replace(/-/g,"/").indexOf('.')>-1?item.start_date.replace(/T/g,' ').replace(/-/g,"/").substring(0,item.start_date.replace(/T/g,' ').replace(/-/g,"/").indexOf('.')):item.start_date.replace(/T/g,' ').replace(/-/g,"/");
							if(new Date().getTime() < new Date(startTxt).getTime()) {
								item.isCan = false;
							}else {
								item.isCan = true;
							}
						})
					}
					if(page > 0) {
						this.detailedList0 = this.detailedList0.concat(res.data.data);
					}else {
						this.detailedList0 = res.data.data;
					}
					// console.log(this.detailedList0)
					if(res.data.number < 10) this.noMore0 = true;
				}else if(status == 2) {
					if(page > 0) {
						this.detailedList1 = this.detailedList1.concat(res.data.data);
					}else {
						this.detailedList1 = res.data.data;
					}
					if(res.data.number < 10) this.noMore1 = true;
				}
				uni.hideLoading();
				if(callBack) callBack();
			})
		},
		cliActivityBtn(index) {
			if(this.activityIdx != index) this.activityIdx = index;
		},
		swiperChaFun(eee) {
			if (eee.detail.source == 'touch') this.activityIdx = eee.detail.current;
		},
		orderScroll() {
			if(this.activityIdx == 0) {
				if(!this.noMore0) {
					this.page0 += 1;
					this.getDataList0(this.page0, 1);
				}
			}else if(this.activityIdx == 1) {
				if(!this.noMore1) {
					this.page1 += 1;
					this.getDataList0(this.page1, 2);
				}
			}
		},
		orderRefresh() {
			if(this.activityIdx == 0) {
				if(!this.ordertri0) {
					this.ordertri0 = true;
					this.noMore0 = false;
					this.page0 = 0;
					this.getDataList0(0, 1, () => {
						this.ordertri0 = false;
					})
				}
			}else if(this.activityIdx == 1) {
				if(!this.ordertri1) {
					this.ordertri1 = true;
					this.noMore1 = false;
					this.page1 = 0;
					this.getDataList0(0, 2, () => {
						this.ordertri1 = false;
					})
				}
			}
		},
		refreshList() {
			this.noMore0 = false;
			this.page0 = 0;
			this.getDataList0(0, 1);
			this.noMore1 = false;
			this.page1 = 0;
			this.getDataList0(0, 2);
		}
	}
}
</script>
<style>
</style>